<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:p="http://primefaces.org/ui">
    <body>
        <ui:composition>
        	<h:form name="frmSearch">
				<div class="select-city">
					<p:megaMenu autoDisplay="false">
						<p:submenu label="Select City">  
				            <p:column>  
				                <p:submenu label="Greater London">  
				                    <p:menuitem value="Sports.1.1" url="#" />  
				                    <p:menuitem value="Sports.1.2" url="#" />  
				                </p:submenu>  
				                <p:submenu label="East of England">  
				                    <p:menuitem value="Bedfordshire" url="#" />  
				                    <p:menuitem value="Cambridgeshire" url="#" />  
				                    <p:menuitem value="Essex" url="#" />  
				                    <p:menuitem value="Norfolk " url="#" />  
				                    <p:menuitem value="Peterborough" url="#" />  
				                    <p:menuitem value="Suffolk" url="#" />  
				                </p:submenu>  
				                <p:submenu label="East Midlands">  
				                    <p:menuitem value="Derbyshire" url="#" />  
				                    <p:menuitem value="Leicestershire" url="#" />  
				                    <p:menuitem value="Lincolnshire " url="#" />  
				                    <p:menuitem value="Nottinghamshire" url="#" />  
				                    <p:menuitem value="Northamptonshire" url="#" />  
				                </p:submenu>  
				            </p:column>  
				  
				            <p:column>  
				                <p:submenu label="North East England">  
				                    <p:menuitem value="Sports.4.1" url="#" />  
				                    <p:menuitem value="Sports.4.2" url="#" />  
				                </p:submenu>  
				                <p:submenu label="North West England">  
				                    <p:menuitem value="Cheshire" url="#" />  
				                    <p:menuitem value="Greater Manchester" url="#" />  
				                    <p:menuitem value="Lancashire" url="#" />  
				                    <p:menuitem value="Merseyside" url="#" />  
				                    <p:menuitem value="Cumbria" url="#" />  
				                    <p:menuitem value="Isle of Man" url="#" />  
				                </p:submenu>  
				                <p:submenu label="South East England">  
				                    <p:menuitem value="Berkshire" url="#" />  
				                    <p:menuitem value="Buckinghamshire" url="#" />  
				                    <p:menuitem value="East Sussex" url="#" />  
				                    <p:menuitem value="Hampshire" url="#" />  
				                    <p:menuitem value="Kent" url="#" />  
				                    <p:menuitem value="Isle of Wight" url="#" />  
				                    <p:menuitem value="Oxfordshire" url="#" />  
				                </p:submenu>  
				            </p:column>  
				            <p:column>  
				                <p:submenu label="East South West England">  
				                    <p:menuitem value="Bristol" url="#" />  
				                    <p:menuitem value="Cornwall" url="#" />  
				                    <p:menuitem value="Devon" url="#" />  
				                    <p:menuitem value="Dorset" url="#" />  
				                    <p:menuitem value="Somerset" url="#" />  
				                    <p:menuitem value="Swindon" url="#" />  
				                    <p:menuitem value="Wiltshire" url="#" />  
				                </p:submenu>  
				                <p:submenu label="West Midlands">  
				                    <p:menuitem value="Sports.7.1" url="#" />  
				                    <p:menuitem value="Sports.7.2" url="#" />  
				                </p:submenu>  
				                <p:submenu label="Yorkshire and the Humber">  
				                    <p:menuitem value="South Yorkshire" url="#" />  
				                    <p:menuitem value="West Yorkshire" url="#" />  
				                    <p:menuitem value="North Yorkshire" url="#" />  
				                    <p:menuitem value="East Riding of Yorkshire" url="#" />  
				                    <p:menuitem value="Lincolnshire" url="#" />  
				                </p:submenu>  
				            </p:column>  
						</p:submenu>
					</p:megaMenu> 					
				</div>         	
				<div class="menu-text" style="padding-left:20px;padding-right:50px;"><a href="#" class="nav">Home</a></div>
				<div class="menu-text"><a href="#" class="nav">About</a></div>
				<div class="menu-text"><a href="#" class="nav">Media</a></div>
				<div class="menu-text" style="padding-right:30px;"><a href="#" class="nav">Products</a></div>
				<div class="menu-text"><a href="#" class="nav">Contact</a></div>
				<div class="menu-select">
			 		<p:selectOneMenu value="" effect="fade">  
			            <f:selectItem itemLabel="Select Category" itemValue="" />  
			            <!--<f:selectItems value="#{autoCompleteBean.searchCategories}" var="searchCategory" itemLabel="#{searchCategory.name}" itemValue="#{searchCategory.value}"/>-->  
			        </p:selectOneMenu>
				</div>
				
				<div class="go" style="float:right; padding:11px 5px;">
					<p:commandButton id="go" value="Go"/>  
				</div>
				<div style="float:right;padding:9px 0px;">
					<p:inputText name="search_box" id="search_box" style="height:16px;width:160px;"/>
					<p:watermark for="search_box" value="Search with a keyword" />
				</div>
			</h:form>
        </ui:composition>
    </body>
</html>